<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--<title>满意网-综合网购首选-正品低价、品质保证、配送即使、轻松购物、包您满意！</title>-->
    <!--icon字体图标-->
    <!--<link rel="shortcut icon" href="image/H6@QR(8]_TR5Z~FGIR$_WI8.png" type="image/x-icon"/>-->
    <!--初始化css-->
    <link rel="stylesheet" href="css/normalize.css" type="text/css">
    <!--公共的css:头部和底部-->
    <link rel="stylesheet" href="css/base.css" type="text/css">
    <!--用户资料的公共css-->
    <link rel="stylesheet" href="css/userInformationBase.css">
    <!--用户资料修改的css-->
    <link rel="stylesheet" href="css/userInformation.css">
    <!--字体图标css-->
    <link rel="stylesheet" type="text/css" href="font/download/font_942gj5vp4fp/iconfont.css">
    <link rel="stylesheet" href="font/download (2)/font_pzp01tyw83/iconfont.css">
    <link rel="stylesheet" href="css/userInformation_order.css">
    <link rel="stylesheet" href="css/userInformation_collection.css">
    <link rel="stylesheet" href="css/userInformation_address.css">
</head>
<body>
<!--快捷导航模块开始-->
<div class="shortcut">
    <div class="w" style="display: block;">
        <ul class="fl">
            <li class="userAccount"></li>
            <li class="spacer">|</li>
            <li><a href="#" class="loginOut">退出</a></li>
        </ul>
        <ul class="fr">
            <li id="phoneAppAfter">
                <a href="#">
                    <span></span>
                    手机版
                </a>
                <div class="phoneApp">
                    <img src="image/shoujierweima.png" alt="">
                    <h4>查看手机网站</h4>
                </div>
                <div class="trangle1"></div>
            </li>
            <li class="spacer">|</li>
            <li>
                <a href="">
                    <span></span>
                    收藏本站
                </a>
            </li>
            <li class="spacer">|</li>
            <li><a href="http://localhost:8080/userinfo">我的资料</a></li>
            <li class="spacer">|</li>
            <li><a href="http://localhost:8080/userinfo">我的订单</a></li>
            <li class="spacer">|</li>
            <li>
                <a href="http://localhost:8080/shoppingcart">
                    <span></span>
                    购物车
                </a>
            </li>
        </ul>
    </div>
</div>
<!--快捷导航模块结束-->
<!--顶部模块开始-->
<div class="header">
    <div class="w">
        <div class="text">
            E-commerce Platform
            <span>Design</span>
        </div>
        <div class="hotwords">
            <div class="itemCenter"><a href="http://localhost:8080">首页</a></div>
            <div class="itemCenter"><a href="http://localhost:8080/discount">优惠抢购</a></div>
            <div class="itemCenter"><a href="http://localhost:8080/secondhand">新品二手</a></div>
            <div class="itemCenter"><a href="http://localhost:8080/appliance">二手电器城</a></div>
            <div class="itemCenter"><a href="http://localhost:8080/member">会员购</a></div>
        </div>
    </div>
</div>
<!--顶部模块结束-->
<!--右侧工具栏开始-->
<div class="afterLogin" style="display: block;">
    <div class="fk-rbar-tabs">
        <i class="message iconfont icon-zhanghao">
            <div class="slogans">我的资料
                <span class="trangle"></span>
            </div>
        </i>
        <i class="collection iconfont icon-shoucang-copy">
            <div class="slogans">我的收藏
                <span class="trangle"></span>
            </div>
        </i>
        <i class="shoppingCar iconfont icon-icon1">
            <div></div>
            <h1>购物车</h1>
            <span>0</span>
        </i>
        <i class="leaveMessage iconfont icon-liuyan">
            <div class="slogans">留言
                <span class="trangle"></span>
            </div>
        </i>
        <i class="erweima iconfont icon-erweima"></i>
        <i class="toTop iconfont icon-fanhuidingbu">
            <div class="slogans">回到顶部
                <span class="trangle"></span>
            </div>
        </i>
    </div>
    <div class="fk-rbar-plugins">
        <div class="myStuffTab"></div>
        <div class="myCollectionTab">
            <div></div>
            <div>亲，还没有入您法眼的商品哟~</div>
        </div>
        <div class="myCartTab">
            <div class="hasNoCartThings" style="display: none;">
                <div></div>
                <div>亲，您的购物车空空的哟~</div>
            </div>
            <div class="hasCartThings" style="display: block">
                <div class="hasCartThings_top">
                    <div class="cartThing">
                        <img src="image/111.jpg" class="cartThingImg">
                        <div class="cartThingTitle">8成新 新概念摄像机 高清专业数码摄像机</div>
                        <div class="cartThingPrice">￥11099</div>
                        <div class="cartThingNumber">x1</div>
                        <div class="cartThingDelete">删除</div>
                    </div>
                </div>
                <div class="hasCartThings_bottom">去购物车结算</div>
            </div>
        </div>
    </div>
</div>
<!--右侧导航栏结束-->
<!--main模块开始-->
<div class="main"></div>
<!--main模块结束-->
<!--body模块开始-->
<div class="body">
    <div class="w">
        <div class="body_left">
            <div class="body_left_t">会员中心</div>
            <div class="body_left_b">
                <span class="addBlBgc"><a href="http://localhost:8080/userInformation" class="list-group-item">我的资料</a></span>
                <span><a href="http://localhost:8080/userinformationorder" class="list-group-item">我的订单</a></span>
                <span><a href="http://localhost:8080/userInformationaddress" class="list-group-item">收货人信息</a></span>
                <span><a href="http://localhost:8080/userInformationcollection" class="list-group-item">我的收藏</a></span>
            </div>
        </div>
        <div class="body_right">
            <div class="body_right_t">我的资料</div>
            <div class="body_right_m">
                <span>
                    <img src="image/touxiang.png" alt="" class="imgHead">
                    <div class="writeHead">编辑头像</div>
                    <input type="file" multiple accept="image/*" style="display: none;" class="file">
                </span>
                <span><span></span>(<i class="iconfont icon-huiyuan">普通会员</i>)</span>
                <span>资料完整度：</span>
                <span></span>
                <span>100%</span>
            </div>
            <div class="body_right_b">
                <p>
                    <label for="accountname">账号名：</label>
                    <input type="text" name="username" id="accountname" maxlength="10" value="" disabled>
                </p>
                <!--<span class="registerMessage">111</span>-->
                <p>
                    <label for="name">姓&nbsp;&nbsp;&nbsp;名：</label>
                    <input type="text" name="password" id="name" maxlength="16" value="">
                </p>
                <p>
                    <label for="userEmail">邮&nbsp;&nbsp;&nbsp;箱：</label>
                    <input type="email" name="username" id="userEmail" value="" pattern="^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$" oninvalid="setCustomValidity('请输入正确的邮箱')">
                </p>
                <!--<span class="registerMessage">111</span>-->
                <p>
                    <label for="telphone">手&nbsp;&nbsp;&nbsp;机：</label>
                    <input type="tel" name="password" id="telphone" maxlength="16" value="" disabled>
                </p>
                <div class="storeBtn" id="storeInformation">保存</div>
            </div>
        </div>
    </div>
</div>
<!--body模块结束-->
<!--foot模块开始-->
<div class="foot">
    <div class="foot_top"><img src="image/5XGBR@Z$QVQ4$%5D1K%60HRJ958.png" alt=""></div>
    <div class="foot_bottom"><img src="image/OP4FMG5S9X_6TVX%6034(PZC2.png" alt=""></div>
</div>
<!--foot模块结束-->
<!--遮挡层-->
<div class="barrier"></div>
<!--更改信息-->
<div class="changeInformation">
    <div class="changeInformationTitle">
        <span>收货人信息</span>
        <span id="closeChangeInformation"></span>
    </div>
    <div class="changeInformationDes">
        <div class="changeInformationDes_name">
            <label for="changeInformationDes_name_t">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</label>
            <i>*</i>
            <input type="text" id="changeInformationDes_name_t">
        </div>
        <div class="changeInformationDes_address">
            <label for="changeInformationDes_address">详细地址</label>
            <i>*</i>
            <input type="text" id="changeInformationDes_address">
        </div>
        <div class="changeInformationDes_tel">
            <label for="changeInformationDes_tel">手&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;机</label>
            <i>*</i>
            <input type="text" id="changeInformationDes_tel">
        </div>
    </div>
    <div class="changeInformationBtn">
        <div class="changeInformationBtnOk" id="changeInformationBtnOk">确定</div>
        <div class="changeInformationBtnCancle" id="changeInformationBtnCancle">取消</div>
    </div>
</div>
<script src="js/jquery-1.12.4.js"></script>
<script src="js/jquery.lazyload.js"></script>
<script src="js/MD5.js"></script>
<script src="js/template-web.js"></script>
<script src="js/jquery.cookie.js"></script>
<script src="js/base.js"></script>
<script src="js/userInformation.js"></script>
<script src="js/picture_clip.js"></script>
<script>
    $(function () {
        $(".writeHead").on("click", function () {
            $(".file").click();
        });
        $(".file").on("change", function (e) {
            picture_clip.init(e.target, 400, 400, function (img_base64) {
                var out = $(".imgHead");
                out.attr("src", img_base64);
                $.ajax({
                    url: "http://localhost:8080/user/changeUserAvatar",
                    type: "post",
                    data: {"userId": $.cookie("userId"), "userAvatar": img_base64},
                    success: function (res) {
                        if (res.result == 1) {
                            localStorage.setItem("userAvatar",img_base64);
                            location.reload();
                        }
                    }
                });
            });
            $(this).val("");
        });
        $(".body_right_m").children("span").eq(1).children("span").text($.cookie("userAccount"));
        $("#accountname").val($.cookie("userAccount"));
        $("#name").val($.cookie("userName"));
        $(".imgHead").attr("src", localStorage.getItem("userAvatar"));
        if ($.cookie("userEmail") == "null") {
            $("#userEmail").val("");
        } else {
            $("#userEmail").val($.cookie("userEmail"));
        }
        $("#telphone").val($.cookie("userPhone"));
        $("#storeInformation").on('click',function () {
            var userName = $("#name").val();
            var userEmail = $("#userEmail").val();
            if (userName==""){
                alert("请填写您的姓名");
                return false;
            }
            else {
                $.ajax({
                    url:"http://localhost:8080/user/changeUserInfo",
                    type:"post",
                    data:{"userId":$.cookie("userId"),"userName":userName,"userEmail":userEmail},
                    success:function (res) {
                        console.log(res);
                        if (res.result==1){
                            alert("修改成功");
                            $.cookie("userName",userName);
                            $.cookie("userEmail",userEmail);
                            location.reload(true);
                        }
                        else {
                            alert("修改失败");
                            return false;
                        }
                    }
                });
            }
        });
    });
</script>
</body>
</html>